<cds-overflow-menu [customTrigger]="customTrigger"
                   [flip]="true">
  <li disabled="true"
      class="show cds--overflow-menu-options__option cds--overflow-menu-options__option--disabled my-2"
      i18n>
    <div class="cds--overflow-menu-options__btn">Logged in as {{ username }}
    </div>
  </li>
  <li class="cds--overflow-menu-options__option cds--overflow-menu--divider mb-2">
    <button *ngIf="!sso"
            routerLink="/user-profile/edit"
            class="cds--overflow-menu-options__btn"
            i18n>
    <svg cdsIcon="locked"
         class="me-2"
         size="16"></svg>Change password
  </button>
  </li>
  <li class="cds--overflow-menu-options__option mb-2">
    <button (click)="logout()"
            data-testid="logout"
            class="cds--overflow-menu-options__btn"
            i18n><svg cdsIcon="logout"
                      class="me-2"
                      size="16"></svg>Log out
  </button>
  </li>
</cds-overflow-menu>

<ng-template #customTrigger>
  <svg cdsIcon="user--filled"
       size="20"
       title="user"></svg>
  <span i18n
        class="d-md-none">Logged in user</span>
</ng-template>
